<template>
  <div class="exhibition">
    <china-map-view @confirm="judgeDateReqType" ref="chinaMap"/>
    <line-map-view @confirm="sendLineMapDataReq"/>
    <list-view @confirm="sendListMapDataReq"/>
  </div>
</template>

<script>
import {
  getMap,
  getMapByPos,
  getLineByTime,
  getPredictLineByTime,
  getListByTime
} from '@/api/map.js'
import ChinaMapView from './components/ChinaMapView/index.vue'
import LineMapView from './components/LineMapView/index.vue'
import ListView from './components/ListView/index.vue'

export default {
  name: 'index',
  components: {
    ChinaMapView,
    LineMapView,
    ListView
  },
  data () {
    return {
      chinaMapData: null,
      lineMapData: null,
      listData: null
    }
  },
  methods: {
    getChinaMapData () {
      return this.chinaMapData
    },
    // 对地图数据进行匹配
    matchingMapData (data) {
      const regions = this.$refs.chinaMap.$refs.map.chart._coordSysMgr
        ._coordinateSystems[0].regions
      for (const region of regions) {
        for (const item of data) {
          if (region.name.startsWith(item.name)) {
            item.name = region.name
          }
        }
      }
    },
    // 将地图数据封装成 {name: '',value: ''}形式的数组
    wrapperMapData (o, k) {
      return o && o.data && o.data[k]
        ? o.data[k].map((item) => {
          return {name: item[0], value: item[1]}
        })
        : []
    },
    // 判断是请求中国地图数据还是请求省份地图数据
    judgeDateReqType (e) {
      if (e.area === 'china') {
        this.sendChinaDataReq(e)
      } else {
        this.sendProvinceDataReq(e)
      }
    },
    // 发送获取中国地图数据的请求
    sendChinaDataReq (e) {
      getMap(e.options).then((res) => {
        this.chinaMapData = this.wrapperMapData(res, 'list')
      })
    },
    // 发送获取省份地图数据的请求
    sendProvinceDataReq (e) {
      e.options.pos = e.area
      getMapByPos(e.options).then((res) => {
        const data = this.wrapperMapData(res, 'list')
        this.matchingMapData(data)
        this.chinaMapData = data
      })
    },
    getLineMapData () {
      return this.lineMapData
    },
    // 日期格式字符串天数增加一天
    addDate (time) {
      let timestamp = Date.parse(new Date(time))
      timestamp = timestamp / 1000
      timestamp += 86400 // 加一天
      const newTime = new Date(timestamp * 1000).format('yyyy-MM-dd hh:mm:ss')
      return newTime
    },
    // 发送获取折线图数据的请求
    sendLineMapDataReq (e) {
      const temp = {}
      getLineByTime(e)
        .then((res) => {
          e.predictTime = this.addDate(e.endTime)
          temp.startTime = e.startTime
          temp.endTime = e.endTime
          temp.predictTime = e.predictTime
          temp.result = res.data.result
          temp.splitTime = e.splitTime
          return getPredictLineByTime(e)
        })
        .then((res) => {
          temp.predict = res.data.predict
          this.lineMapData = temp
        })
    },
    getListData () {
      return this.listData
    },
    // 发送获取列表数据的请求
    sendListMapDataReq (e) {
      getListByTime(e).then((res) => {
        this.listData = res.data
      })
    }
  },
  provide () {
    return {
      getChinaMapData: this.getChinaMapData,
      getLineMapData: this.getLineMapData,
      getListData: this.getListData
    }
  }
}
</script>

<style scoped>
</style>
